// 情感化动效组件
Component({
  properties: {
    // 情感类型
    emotion: {
      type: String,
      value: 'neutral', // neutral, happy, sad, excited, calm, love, angry, surprised
    },
    // 动效强度
    intensity: {
      type: String,
      value: 'medium', // low, medium, high
    },
    // 主题
    theme: {
      type: String,
      value: 'default', // default, his, hers
    },
    // 是否自动播放
    autoPlay: {
      type: Boolean,
      value: true,
    },
    // 循环播放
    loop: {
      type: Boolean,
      value: false,
    },
    // 动画时长（毫秒）
    duration: {
      type: Number,
      value: 1000,
    },
    // 自定义样式类
    customClass: {
      type: String,
      value: '',
    },
    // 是否显示粒子效果
    particles: {
      type: Boolean,
      value: false,
    },
    // 触发方式
    trigger: {
      type: String,
      value: 'auto', // auto, tap, hover, scroll
    },
  },

  data: {
    animationData: {},
    particleData: {},
    isPlaying: false,
    currentFrame: 0,
    animationTimer: null,
    particleTimer: null,
  },

  lifetimes: {
    attached() {
      this.initAnimation();
      if (this.data.autoPlay) {
        this.playAnimation();
      }
    },
    detached() {
      this.stopAnimation();
    },
  },

  observers: {
    'emotion, intensity, theme': function() {
      this.initAnimation();
      if (this.data.isPlaying) {
        this.playAnimation();
      }
    },
  },

  methods: {
    // 初始化动画
    initAnimation() {
      const { emotion, intensity, theme, duration } = this.data;
      const config = this.getAnimationConfig(emotion, intensity);
      
      this.animation = wx.createAnimation({
        duration: duration,
        timingFunction: config.timingFunction,
        delay: config.delay,
        transformOrigin: config.transformOrigin,
      });

      this.setData({
        animationData: this.animation.export(),
      });
    },

    // 获取动画配置
    getAnimationConfig(emotion, intensity) {
      const configs = {
        neutral: {
          timingFunction: 'ease',
          delay: 0,
          transformOrigin: 'center center',
        },
        happy: {
          timingFunction: 'ease-out',
          delay: 0,
          transformOrigin: 'center center',
        },
        sad: {
          timingFunction: 'ease-in',
          delay: 100,
          transformOrigin: 'center center',
        },
        excited: {
          timingFunction: 'cubic-bezier(0.68, -0.55, 0.265, 1.55)',
          delay: 0,
          transformOrigin: 'center center',
        },
        calm: {
          timingFunction: 'ease-in-out',
          delay: 200,
          transformOrigin: 'center center',
        },
        love: {
          timingFunction: 'ease-out',
          delay: 0,
          transformOrigin: 'center center',
        },
        angry: {
          timingFunction: 'ease-in-out',
          delay: 0,
          transformOrigin: 'center center',
        },
        surprised: {
          timingFunction: 'cubic-bezier(0.25, 0.46, 0.45, 0.94)',
          delay: 0,
          transformOrigin: 'center center',
        },
      };

      return configs[emotion] || configs.neutral;
    },

    // 播放动画
    playAnimation() {
      if (this.data.isPlaying) return;
      
      this.setData({ isPlaying: true });
      
      const { emotion, intensity } = this.data;
      
      switch (emotion) {
        case 'happy':
          this.playHappyAnimation(intensity);
          break;
        case 'sad':
          this.playSadAnimation(intensity);
          break;
        case 'excited':
          this.playExcitedAnimation(intensity);
          break;
        case 'calm':
          this.playCalmAnimation(intensity);
          break;
        case 'love':
          this.playLoveAnimation(intensity);
          break;
        case 'angry':
          this.playAngryAnimation(intensity);
          break;
        case 'surprised':
          this.playSurprisedAnimation(intensity);
          break;
        default:
          this.playNeutralAnimation(intensity);
      }

      if (this.data.particles) {
        this.playParticleEffect();
      }

      // 触发事件
      this.triggerEvent('animationstart', { emotion, intensity });
    },

    // 停止动画
    stopAnimation() {
      if (this.data.animationTimer) {
        clearTimeout(this.data.animationTimer);
      }
      if (this.data.particleTimer) {
        clearTimeout(this.data.particleTimer);
      }
      
      this.setData({ 
        isPlaying: false,
        animationTimer: null,
        particleTimer: null,
      });
      
      this.triggerEvent('animationend');
    },

    // 开心动画
    playHappyAnimation(intensity) {
      const scales = { low: 1.05, medium: 1.1, high: 1.2 };
      const scale = scales[intensity] || scales.medium;
      
      this.animation.scale(scale).step();
      this.animation.scale(1).step();
      
      this.setData({
        animationData: this.animation.export(),
      });
      
      if (this.data.loop) {
        const timer = setTimeout(() => {
          this.playHappyAnimation(intensity);
        }, this.data.duration * 2);
        this.setData({ animationTimer: timer });
      } else {
        const timer = setTimeout(() => {
          this.stopAnimation();
        }, this.data.duration * 2);
        this.setData({ animationTimer: timer });
      }
    },

    // 悲伤动画
    playSadAnimation(intensity) {
      const scales = { low: 0.98, medium: 0.95, high: 0.9 };
      const scale = scales[intensity] || scales.medium;
      
      this.animation.scale(scale).step();
      this.animation.scale(1).step();
      
      this.setData({
        animationData: this.animation.export(),
      });
      
      if (this.data.loop) {
        const timer = setTimeout(() => {
          this.playSadAnimation(intensity);
        }, this.data.duration * 2);
        this.setData({ animationTimer: timer });
      } else {
        const timer = setTimeout(() => {
          this.stopAnimation();
        }, this.data.duration * 2);
        this.setData({ animationTimer: timer });
      }
    },

    // 兴奋动画
    playExcitedAnimation(intensity) {
      const rotations = { low: 5, medium: 10, high: 15 };
      const scales = { low: 1.1, medium: 1.15, high: 1.25 };
      const rotation = rotations[intensity] || rotations.medium;
      const scale = scales[intensity] || scales.medium;
      
      this.animation.rotate(rotation).scale(scale).step();
      this.animation.rotate(-rotation).scale(scale).step();
      this.animation.rotate(0).scale(1).step();
      
      this.setData({
        animationData: this.animation.export(),
      });
      
      if (this.data.loop) {
        const timer = setTimeout(() => {
          this.playExcitedAnimation(intensity);
        }, this.data.duration * 3);
        this.setData({ animationTimer: timer });
      } else {
        const timer = setTimeout(() => {
          this.stopAnimation();
        }, this.data.duration * 3);
        this.setData({ animationTimer: timer });
      }
    },

    // 平静动画
    playCalmAnimation(intensity) {
      const opacities = { low: 0.9, medium: 0.8, high: 0.7 };
      const opacity = opacities[intensity] || opacities.medium;
      
      this.animation.opacity(opacity).step();
      this.animation.opacity(1).step();
      
      this.setData({
        animationData: this.animation.export(),
      });
      
      if (this.data.loop) {
        const timer = setTimeout(() => {
          this.playCalmAnimation(intensity);
        }, this.data.duration * 2);
        this.setData({ animationTimer: timer });
      } else {
        const timer = setTimeout(() => {
          this.stopAnimation();
        }, this.data.duration * 2);
        this.setData({ animationTimer: timer });
      }
    },

    // 爱心动画
    playLoveAnimation(intensity) {
      const scales = { low: [1, 1.08, 1], medium: [1, 1.15, 1], high: [1, 1.25, 1] };
      const scaleSequence = scales[intensity] || scales.medium;
      
      scaleSequence.forEach((scale, index) => {
        this.animation.scale(scale).step();
      });
      
      this.setData({
        animationData: this.animation.export(),
      });
      
      if (this.data.loop) {
        const timer = setTimeout(() => {
          this.playLoveAnimation(intensity);
        }, this.data.duration * scaleSequence.length);
        this.setData({ animationTimer: timer });
      } else {
        const timer = setTimeout(() => {
          this.stopAnimation();
        }, this.data.duration * scaleSequence.length);
        this.setData({ animationTimer: timer });
      }
    },

    // 愤怒动画
    playAngryAnimation(intensity) {
      const translations = { low: 2, medium: 5, high: 8 };
      const translation = translations[intensity] || translations.medium;
      
      for (let i = 0; i < 3; i++) {
        this.animation.translateX(translation).step({ duration: 50 });
        this.animation.translateX(-translation).step({ duration: 50 });
      }
      this.animation.translateX(0).step({ duration: 50 });
      
      this.setData({
        animationData: this.animation.export(),
      });
      
      if (this.data.loop) {
        const timer = setTimeout(() => {
          this.playAngryAnimation(intensity);
        }, 350);
        this.setData({ animationTimer: timer });
      } else {
        const timer = setTimeout(() => {
          this.stopAnimation();
        }, 350);
        this.setData({ animationTimer: timer });
      }
    },

    // 惊讶动画
    playSurprisedAnimation(intensity) {
      const scales = { low: 1.2, medium: 1.3, high: 1.5 };
      const scale = scales[intensity] || scales.medium;
      
      this.animation.scale(scale).step({ duration: 100 });
      this.animation.scale(1).step({ duration: 200 });
      
      this.setData({
        animationData: this.animation.export(),
      });
      
      if (this.data.loop) {
        const timer = setTimeout(() => {
          this.playSurprisedAnimation(intensity);
        }, 300);
        this.setData({ animationTimer: timer });
      } else {
        const timer = setTimeout(() => {
          this.stopAnimation();
        }, 300);
        this.setData({ animationTimer: timer });
      }
    },

    // 中性动画
    playNeutralAnimation(intensity) {
      this.animation.scale(1.02).step();
      this.animation.scale(1).step();
      
      this.setData({
        animationData: this.animation.export(),
      });
      
      const timer = setTimeout(() => {
        this.stopAnimation();
      }, this.data.duration * 2);
      this.setData({ animationTimer: timer });
    },

    // 播放粒子效果
    playParticleEffect() {
      const particleAnimation = wx.createAnimation({
        duration: this.data.duration,
        timingFunction: 'ease-out',
      });
      
      particleAnimation.scale(2).opacity(0).step();
      
      this.setData({
        particleData: particleAnimation.export(),
      });
      
      const timer = setTimeout(() => {
        particleAnimation.scale(1).opacity(1).step({ duration: 0 });
        this.setData({
          particleData: particleAnimation.export(),
        });
      }, this.data.duration);
      
      this.setData({ particleTimer: timer });
    },

    // 事件处理
    onTap() {
      if (this.data.trigger === 'tap') {
        this.playAnimation();
      }
      this.triggerEvent('tap');
    },

    onTouchStart() {
      if (this.data.trigger === 'hover') {
        this.playAnimation();
      }
      this.triggerEvent('touchstart');
    },

    // 外部调用方法
    play() {
      this.playAnimation();
    },

    stop() {
      this.stopAnimation();
    },

    reset() {
      this.stopAnimation();
      this.initAnimation();
    },
  },
});